<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <textarea name="jsonData" id="jsonData" cols="200" rows="10"></textarea>
    <table id="table">
        <thead>
            <tr>
                <th>产品名</th>
                <td>图片</td>
                <td>品牌</td>
                <td>市场价</td>
                <td>单价</td>
                <td>海报</td>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td></td>
            </tr>
        </tbody>
    </table>
</body>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$("#jsonData").blur(function(){
    let data = JSON.parse($(this).val())
    let tbody = ''
    let goods = data.data.goods
    if(data.data.rank && data.data.rank.length > 0){
        rank = data.data.rank
        goods = []
        for(i in rank){
            for(j in rank[i].goods){
                goods.push(rank[i].goods[j])
            }
        }
    }else if(data.data.itemList){
        rank = data.data.itemList
        goods = []
        for(i in rank){
            if(rank[i].type == 1){
                goods.push(rank[i].data)
            }
        }
        console.log()
    }
    console.log(goods)
    for(i in goods){
        let goodsJsonCode = encodeURI(JSON.stringify(goods[i]))
        let goodsJson = JSON.stringify(goods[i])

        mainImg = goods[i]['spuInfo']['mainImgUrl']
        if(isJSON(mainImg)){
            mainImgUrl = JSON.parse(goods[i]['spuInfo']['mainImgUrl'])
            if(typeof mainImgUrl == "object"){
                mainImg = mainImgUrl.o
            }
        }
        
        tbody += `
        <tr>
            <td>${goods[i]['spuInfo']['name']}</td>
            <td><img src="${mainImg}" width="60px"/></td>
            <td>${goods[i]['merchantInfo']['name']}</td>
            <td>${goods[i]['spuInfo']['marketPrice']/100}</td>
            <td>${goods[i]['spuInfo']['showPrice']/100}</td>
            <td><textarea cols="30" row="5">${goodsJson}</textarea></td>
            <td><a href="./info.html?data=${goodsJsonCode}" target="_blank">海报</a></td>
        </tr>
        `
    }
    $("#table tbody").html(tbody)
})

function isJSON(str) {
    if (typeof str == 'string') {
        try {
            var obj=JSON.parse(str);
            if(typeof obj == 'object' && obj ){
                return true;
            }else{
                return false;
            }

        } catch(e) {
            console.log('error：'+str+'!!!'+e);
            return false;
        }
    }
    // console.log('It is not a string!')
}
</script>
</html>